<template>
  <div class="service_famer">
       <h4>供应商服务条款</h4>
       <div class="container">
           <quill-editor  v-model="content"
               :options="editorOption" 
               @blur="onEditorBlur($event)" 
               @focus="onEditorFocus($event)"
               @change="onEditorChange($event)">
           </quill-editor>
            <el-button type="primary" style="margin: 30px  0;" @click="submit()">提交</el-button>
       </div>
  </div>
</template>

<script>
import { quillEditor } from 'vue-quill-editor'
import { isHaveContent,addFarmerService,updata_farmerService } from '@/request/api'
export default {
    data(){
            return{
                content:'',
                editorOption:{},
                flag:0, // 0 新增 1 修改 
                id:''
            }
    },
    created(){
       this.getMsg();
    },
    methods:{
         onEditorBlur(editor){//失去焦点事件    
 	     },
        onEditorFocus(editor){//获得焦点事件
        },
        onEditorChange({editor,html,text}){//编辑器文本发生变化
            //this.content可以实时获取到当前编辑器内的文本内容
            console.log(this.content);
        },
        submit(){
            if( this.flag == 0 ) {
                //  新增接口 
                addFarmerService({
                    farmerStatement:this.content
                }).then(res => {
                     console.log(res);
                     if(res.code == 1){
                         this.$message({
                                type: 'success',
                                message: '新增成功!'
                        });
                     }
                })
            }else {
                // 修改接口 
                 updata_farmerService({
                    farmerStatement:this.content,
                    id:this.id
                }).then(res => {
                     console.log(res);
                     if(res.code == 1){
                         this.$message({
                                type: 'success',
                                message: '修改成功!'
                         });
                     }
                })
            }
        },
        getMsg(){
                isHaveContent({
                        id:1
                }).then(res => {
                        if(res.code == 0) {
                            this.flag = 0;
                            //   新增 
                        }else if(res.code == 1) {
                            this.flag = 1;
                            this.content = res.data.content;
                            this.id = res.data.id;
                       }
               })
        }
        
    },
    components:{
        quillEditor
    }

 }
</script>
<style  scoped>
.service_famer  h4 {
    line-height: 22px;
    border-left: 5px solid rgb(32, 160, 255);
    font-size:16px;
    color: #666;
    padding-left:  10px;
    font-size:18px;
    margin-bottom:20px;
}
</style>